<template>
  <div style="height: 400px;" id="charts2" ref="charts2">
  </div>
</template>
<script>
  export default {
    mounted() {
      this.drawchart()
    },
    methods: {
      drawchart() {
        var option = {
          tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b}: {c} ({d}%)"
          },
/*          legend: {
/!*            orient: 'vertical',
            x: 'left',*!/
            data:['玻璃纤维职业','木制品职业','化工职业','金属接触职业','辐射职业','公务员','自由职业','农业','普通职员','其它']
          },*/
          series: [
            {
              name:'访问来源',
              type:'pie',
              selectedMode: 'single',
              radius: [0, '30%'],

              label: {
                normal: {
                  position: 'inner'
                }
              },
              labelLine: {
                normal: {
                  show: false
                }
              },
              data:[
                {value:300, name:'高危职业'},
                {value:679, name:'普通职业', selected:true},
              ]
            },
            {
              name:'访问来源',
              type:'pie',
              radius: ['55%', '70%'],
              data:[
                {value:258, name:'玻璃纤维职业'},
                {value:563, name:'木制品职业'},
                {value:738, name:'化工职业'},
                {value:833, name:'金属接触职业'},
                {value:213, name:'辐射职业'},
                {value:644, name:'公务员'},
                {value:1782, name:'自由职业'},
                {value: 1365, name:'农业'},
                {value: 1922, name:'普通职员'},
                {value:455, name:'其它',itemStyle: {color: '#80b790'}},
              ]
            }
          ]
        };
        var mycharts = this.$echarts.init(this.$refs.charts2)
        mycharts.setOption(option)
      }
    }
  }
</script>
<style></style>
